<template>
  <div class="app-main-container">
    <el-tabs v-model="activeTab">
      <el-tab-pane label="教练信息" name="1"><CoachAdmin v-if="activeTab === '1'" :meta="meta" @changeTabs="changeTabs" /></el-tab-pane>
      <el-tab-pane label="上课记录" name="2"><ClassRecord v-if="activeTab === '2'" :meta="meta" @changeTabs="changeTabs" /></el-tab-pane>
      <el-tab-pane v-if="meta.indexOf('TeacherLevelList') > -1" label="教练等级管理" name="3"><LevelAdmin v-if="activeTab === '3'" :meta="meta" @changeTabs="changeTabs" /></el-tab-pane>
      <el-tab-pane label="教练消课配置" name="4">
        <el-form ref="form" :model="form" label-width="10em">
          <el-form-item label="是否允许教练消课：">
            <el-switch v-model="form.isTrain" active-value="1" inactive-value="2" @change="editStatus" />
          </el-form-item>
          <el-form-item v-if="form.isTrain == '1'" label-width="10em">
            <el-radio-group v-model="form.type" @change="editStatus">
              <el-radio label="1" value="1">扫码签到</el-radio>
              <el-radio label="2" value="2">直接签到</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-form>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import CoachAdmin from './coachAdmin'
import ClassRecord from './classRecord'
import LevelAdmin from './levelAdmin'
import {
  courseTrainUpdate,
  courseTrain
} from '@/api'
export default {
  name: 'CoachManagementList',
  components: {
    CoachAdmin,
    ClassRecord,
    LevelAdmin
  },
  data() {
    return {
      activeTab: '1',
      meta: [],
      form: {}
    }
  },
  created() {
    this.meta = this.$route.meta.buttons || []
    this.getCourseTrain()
  },
  methods: {
    getCourseTrain() {
      courseTrain({ param: {}}).then(res => {
        if (res.errorCode !== '000000') return
        this.form = res.record || { }
      }, () => {})
    },
    editStatus() {
      const param = { ...this.form }
      courseTrainUpdate({ param }).then(res => {
        if (res.errorCode !== '000000') return
        this.$message.success('修改配置成功')
      }, () => {})
    },
    changeTabs(val) {
      this.activeTab = val
    }
  }

}
</script>

<style lang="scss" scoped>

</style>
